<template>
  <base-breadcrumb>
    <a-form :form="form">
      <a-card :body-style="{ padding: '24px 32px' }" :bordered="false">
        <a-tabs ref="tabs" v-model="nextSteps" @change="callback">
          <a-tab-pane key="1" tab="基本信息">
            <a-row :gutter="24">
              <template v-if="isDesign">
                <a-col :md="8" :sm="8">
                  <a-form-item label="项目设计管理类别" :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                    :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }">
                    <a-select v-decorator="['designId', { rules: [{ required: true, message: ' ' }] }]">
                      <a-select-option v-for="item in designTypes" :key="item.id" :value="item.id">
                        {{ item.name }}
                      </a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col>
              </template>
              <template v-if="isTechnology">
                <a-col :md="8" :sm="8">
                  <a-form-item label="项目科技管理类别" :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                    :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }">
                    <a-select v-decorator="['technologyId', { rules: [{ required: true, message: ' ' }] }]">
                      <a-select-option v-for="item in techonlogyTypes" :key="item.id" :value="item.id">
                        {{ item.name }}
                      </a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col>
              </template>
              <template v-if="isQuality">
                <a-col :md="8" :sm="8">
                  <a-form-item label="项目类别(质量)" :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                    :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }">
                    <a-select mode="multiple" v-decorator="['qualityIds', { rules: [{ required: true, message: ' ' }] }]"  :loading="type0loading">
                      <a-select-option v-for="item in qualityTypes" :key="item.projectTypeId"
                        :value="item.projectTypeId">
                        {{ item.projectTypeName }}
                      </a-select-option>
                    </a-select>
                  </a-form-item>
                </a-col>
              </template>

              <template v-if="isCompany">
                <a-col :md="8" :sm="8">
                  <a-form-item label="分包合同额（万）" :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                    :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }">
                    <BaseInputNumber
                            :precision="2"
                      v-decorator="['contractAmount', { rules: [{ required: true, message: '请输入分包合同额' }] }]"
                      placeholder="" :min="1" style="width: 100%;" />
                  </a-form-item>
                </a-col>
                <a-col :md="8" :sm="8">
                  <a-form-item label="备注" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                    <BaseInput
                      v-decorator="['remark', { initialValue: dels.remark }, { rules: [{ required: true, message: ' ' }] }]"
                      placeholder="备注" type="textarea" />
                  </a-form-item>
                </a-col>
              </template>
            </a-row>
            <a-row :gutter="24">
              <a-col :md="8" :sm="8">
                <a-form-item label="工程承包模式" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.contractModelName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="承包类型" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.innerPackageName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col v-if="isContract" :md="8" :sm="8">
                <a-form-item label="专业承包公司" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.contractBranchName" type="text" disabled />
                </a-form-item>
              </a-col>

              <a-col v-if="isGeneral" :md="8" :sm="8">
                <a-form-item label="总承包单位" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.generalContractorCompanyName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="项目备案名称" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.projectName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="项目简称" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.projectOmit" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="项目编号" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.projectNum" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="中标时间" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.winningTime" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="一级地域" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.oneAreaName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="二级地域" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.secondAreaName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="三级地域" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.threeAreaName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="四级地域" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.fourAreaName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="地理坐标" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInputNumber v-model="dels.longitude" type="text"
                    style="margin-right: 20px; width: 100px !important; float: left" disabled />
                  <BaseInputNumber v-model="dels.latitude" type="text" style="width: 100px !important; float: left"
                    disabled />
                </a-form-item>
              </a-col>
              <a-col :md="24" :sm="24">
                <a-form-item label="详细地址" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseTextarea v-model="dels.projectAddress" :title="dels.projectAddress" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="区域一级管辖单位(所属办事处)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.jurisdictionOneName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="区域二级管辖单位(所属办事处)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.jurisdictionTwoName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="签约单位" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.contractUnit" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="承接名义" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.undertakeName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="实施单位(所属二级单位)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.implementationTwoName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="实施单位(所属三级单位)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.implementationThreeName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="项目类型" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.projectTypeName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="项目业态" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.projectFormatName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="结构类型" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.structureTypeName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="项目重要程度" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.projectImportanceName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="是否为重点项目" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.keyProjectsName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="工程类型" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.engineeringTypeName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="工程性质" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.projectNatureName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="局级大客户" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.bureauCustomerName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="公司级大客户" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.companyCustomerName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="客户级别" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.customerLevelName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="设计单位名称" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.designUnitName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="建设单位名称" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.constructionName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="建设单位性质" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.constructionNatureName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="建设单位社会统一信用代码" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.constructionCode" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="审计单位名称" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.auditName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="监理单位名称" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.supervisionName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="勘察单位名称" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.surveyName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="咨询单位名称" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.consultingName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="是否签订合同" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <a-radio-group v-model="dels.contractCode" disabled>
                    <a-radio :value="1">
                      已签订
                    </a-radio>
                    <a-radio :value="0">
                      未签订
                    </a-radio>
                  </a-radio-group>
                </a-form-item>
              </a-col>
              <a-col v-if="isContractMileage" :md="8" :sm="8">
                <a-form-item label="合同工程里程(Km)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.contractMileage" type="text" disabled />
                </a-form-item>
              </a-col>
              <template v-if="isConstruction" :gutter="24">
                <a-col :md="8" :sm="8">
                  <a-form-item label="合同建筑面积-地上(万m2)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                    <BaseInput v-model="dels.contractAreaGround" type="text" disabled />
                  </a-form-item>
                </a-col>

                <a-col :md="8" :sm="8">
                  <a-form-item label="合同建筑面积-地下(万m2)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                    <BaseInput v-model="dels.contractAreaUnderground" type="text" disabled />
                  </a-form-item>
                </a-col>

                <a-col :md="8" :sm="8">
                  <a-form-item label="地上层数" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                    <BaseInput v-model="dels.groundFloor" type="text" disabled />
                  </a-form-item>
                </a-col>
                <a-col :md="8" :sm="8">
                  <a-form-item label="地下层数" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                    <BaseInput v-model="dels.undergroundFloor" type="text" disabled />
                  </a-form-item>
                </a-col>
                <a-col :md="8" :sm="8">
                  <a-form-item label="合同建筑总面积(万m2)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                    :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                    <BaseInput v-model="dels.contractTotalArea" type="text" disabled />
                  </a-form-item>
                </a-col>
              </template>
              <a-col :md="8" :sm="8">
                <a-form-item label="合同单体工程个数" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.contractSingleProject" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="最高(长)单位工程米数(Km)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.engineeringMeters" type="text" disabled />
                </a-form-item>
              </a-col>
              <!--<a-col :md="8" :sm="8">-->
              <!--<a-form-item-->
              <!--label="维保期时间"-->
              <!--:labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"-->
              <!--:wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }"-->
              <!--&gt;-->
              <!--<BaseInput v-model="dels.maintenanceTime" type="text" disabled></BaseInput>-->
              <!--</a-form-item>-->
              <!--</a-col>-->
              <a-col :md="8" :sm="8">
                <a-form-item label="合同开工日期" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <a-date-picker v-model="dels.contractStartDate" disabled placeholder="请选择日期" />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="合同竣工日期" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <a-date-picker v-model="dels.contractEndDate" disabled style="" placeholder="请选择日期" />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="合同工期(天)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.contractDays" disabled placeholder="合同工期" />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="合同额(万)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInputNumber v-model="dels.contractValue" type="text" disabled :min="0"
                    @change="calcEstimateTotalAmount" />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="自有施工合同额(万)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInputNumber v-model="dels.ownerContractValue" type="text" disabled :min="0"
                                   :precision="2"
                    @change="calcEstimateTotalAmount" />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="专业工程暂估价总额(万)" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInputNumber v-model="dels.estimateTotalAmount" type="text" :min="0" :step="0.01" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="专业项目经理" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.projectManagerName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="24" :sm="24">
                <a-form-item label="项目特点或难点" :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                  :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }">
                  <BaseInput v-model="dels.projectFeatures" type="textarea" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="24" :sm="24">
                <a-form-item label="主施工范围" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.mainScope" type="textarea" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="计划创优级别" :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                  :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }">
                  <BaseInput v-model="dels.excellencePlanName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="计划创优内容" :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"
                  :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }">
                  <BaseInput v-model="dels.meritContentName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="计划观摩级别" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.observePlanName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="24" :sm="24">
                <a-form-item label="计划观摩内容" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.observeContent" type="textarea" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="项目设计管理类别" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.designName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="项目科技管理类别" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.technologyName" type="text" disabled />
                </a-form-item>
              </a-col>
              <a-col :md="8" :sm="8">
                <a-form-item label="项目类别（质量）" :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
                  :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }">
                  <BaseInput v-model="dels.qualityName" type="text" disabled />
                </a-form-item>
              </a-col>

              <a-button style="float: right; margin-top: 20px;margin-right: 20px;" type="primary" @click="nextStep()">
                下一页
              </a-button>
            </a-row>
          </a-tab-pane>
          <a-tab-pane key="2" tab="项目部设置">
            <title-name title="项目领导班子人员配置" />
            <a-table :columns="columns" :data-source="projectPost" bordered :pagination="false">
              <span slot="serial" slot-scope="text, record, index">{{ index + 1 }}</span>
              <span slot="jobName" slot-scope="text, record">
                <template>
                  <span v-if="record.requiredCode == 1" class="requireRed">*</span> {{ record.jobName }} ({{
                      record.canBothName
                  }},{{ record.numberLimitName }})
                </template>
              </span>
              <span slot="employeeName" slot-scope="record">
                <template>
                  {{ record.staffList.map(s => s.staffName).join(',') }}
                </template>
              </span>
              <span slot="employeeNum" slot-scope="record">
                <template>
                  <span v-for="(staff, index) in record.staffList" :key="index">
                    <span v-if="index != 0">,</span>
                    <sapn v-if="staff.statusCode == 0" style="color:rgba(0, 0, 0, 0.65)">{{ staff.staffCode }}</sapn>
                    <sapn v-else-if="staff.statusCode != 0" style="color:red;">{{ staff.staffCode }}</sapn>
                  </span>
                </template>
              </span>
              <span slot="status" slot-scope="record">
                <template>
                  {{ record.staffList.map(s => s.statusName).join(',') }}
                </template>
              </span>
              <span v-if="isCompany" slot="operation" slot-scope="text, record">
                <template>
                  <a @click="handleEdit(record)">编辑</a>
                </template>
              </span>
            </a-table>

            <title-name title="其他岗位人员配置" style="margin-top: 20px;" />
            <a-table :columns="columns" :data-source="otherPost" bordered :pagination="false">
              <span slot="serial" slot-scope="text, record, index">{{ index + 1 }}</span>
              <span slot="jobName" slot-scope="text, record">
                <template>
                  <span v-if="record.requiredCode == 1" class="requireRed">*</span> {{ record.jobName }} ({{
                      record.canBothName
                  }},{{ record.numberLimitName }})
                </template>
              </span>
              <span slot="employeeName" slot-scope="record">
                <template>
                  {{ record.staffList.map(s => s.staffName).join(',') }}
                </template>
              </span>
              <span slot="employeeNum" slot-scope="record">
                <template>
                  <span v-for="(staff, index) in record.staffList" :key="staff">
                    <span v-if="index != 0">,</span>
                    <sapn v-if="staff.statusCode == 0" style="color:rgba(0, 0, 0, 0.65)">{{ staff.staffCode }}</sapn>
                    <sapn v-else-if="staff.statusCode != 0" style="color:red;">{{ staff.staffCode }}</sapn>
                  </span>
                </template>
              </span>
              <span slot="status" slot-scope="record">
                <template>
                  {{ record.staffList.map(s => s.statusName).join(',') }}
                </template>
              </span>
              <span v-if="isCompany" slot="operation" slot-scope="text, record">
                <template>
                  <a @click="handleEdit(record)">编辑</a>
                </template>
              </span>
            </a-table>
            <a-button style="float:right;margin-top: 20px;" type="primary" @click="nextStep()">
              下一步
            </a-button>
          </a-tab-pane>
          <a-tab-pane key="3" tab="附件上传">
            <title-name title="附件上传" />
            <u-table :is-show="isCompany" :list-url="listUrl" :upload-list="uploadList" :delete-url="deleteUrl"
              :business-id="businessId" business-code="PM01" />
          </a-tab-pane>
        </a-tabs>

        <add-ad-just ref="createModal" :visible="visible" :loading="confirmLoading" :data-source-prop="datas"
          :model="mdl" :multi="employeeMultiSelect" @dataSources="dataSources" @employeeNums="employeeNums"
          @employees="changeEmployees" @cancel="handleCancel" @ok="handleOk" />
      </a-card>
    </a-form>
    <div class="page-btn-right-top">
      <a-button type="primary" style="margin-right: 20px" :loading="loadingState.isSubmit" @click="submit">
        提交
      </a-button>
      <a-button type="primary" @click="goBack">
        关闭
      </a-button>
    </div>
  </base-breadcrumb>
</template>

<script>
import FooterToolBar from '@/components/FooterToolbar'
import AddAdJust from '../../projects/addProjects/addAdjust'
import {
  getDesignType,
  getProjectsDel,
  editBranchInfo,
  getDepartConfig,
  addDepartmentConfig,
  getInstallationBranchId,
  getProjectTypes,
  editCatagoryInfo
} from '@/api/project/projects'
import { getProjectypesList } from '@/api/project/projectypes'
import { getImportantsList } from '@/api/project/importants'
import { getTypes } from '@/api/commons'
import { getCustomerList, getCustomersOne } from '@/api/project/customers'

const columns = [
  {
    title: '序号',
    width: 65,
    scopedSlots: { customRender: 'serial' }
  },
  {
    title: '岗位名称',
    dataIndex: 'jobName',
    width: '30%',
    scopedSlots: { customRender: 'jobName' }
  },
  {
    title: '岗位人员姓名',
    width: '25%',
    scopedSlots: { customRender: 'employeeName' }
  },
  {
    title: '员工编号',
    width: '25%',
    scopedSlots: { customRender: 'employeeNum' }
  },
  {
    title: '操作',
    dataIndex: 'operation',
    scopedSlots: { customRender: 'operation' }
  }
]
const columns1 = [
  {
    title: '序号',
    width: 65,
    dataIndex: 'name',

    scopedSlots: { customRender: 'name' }
  },
  {
    title: '附件名称',
    dataIndex: 'annuxName',
    width: '15%',
    scopedSlots: { customRender: 'age' }
  },
  {
    title: '附件格式',
    dataIndex: 'annux',
    scopedSlots: { customRender: 'annux' }
  },
  {
    title: '附件地址',
    dataIndex: 'annuxAddress',
    width: '40%',
    scopedSlots: { customRender: 'annuxAddress' }
  },
  {
    title: '操作',
    dataIndex: 'operation',
    scopedSlots: { customRender: 'operation' }
  }
]

// 数组创建时候的下标
var numbe = 0
export default {
  name: 'a' + Date.now(),
  components: {
    AddAdJust
  },
  props: {
    text: String
  },

  data() {
    return {
      type0loading: false,
      loadingState: {
        isSubmit: false
      },
      employeeMultiSelect: false, //员工多选
      datas: [],
      visible: false, // 人员配置调整
      confirmLoading: false,
      mdl: null, // 数据

      projectModecode: '', // 工程承包模式code
      projectModeId: '', // 工程承包模式
      isContract: false, // 专业承包分公司
      isGeneral: false, // 总承包公司

      editable: false,
      projectNum: '',

      nextSteps: '1',

      selectDatas: {}, // 立项返回下拉数据

      // 附件上传
      listUrl: '/cscec-project-business/file/business/project-fileQuery',
      deleteUrl: '/cscec-project-business/file/business/project-fileDelete',
      uploadList: '/cscec-project-business/file/business/fileUpload',
      businessId: '',

      columns,
      columns1,
      editingKey: '',
      selectedRowKeys: [],

      value: 1, // 是否签订合同

      previewImage: '',

      data: [{ postName: '项目经理', employeeName: '张三', employeeNum: '231231' }],

      queryParam: {
        projectName: '',
        name: ''
      },
      form: this.$form.createForm(this),
      status: 'all',
      areaCode: '',
      employeeNum: '', // 项目部设置人员调整员工编号
      employees: [], //设置的项目部人员信息

      isContractMileage: false, // 线性基础数据
      isConstruction: false, // 房建
      id: '', // 项目id
      branchCode: '', // 是否是分公司 科技管理中心
      dels: {},
      designTypes: [],
      techonlogyTypes: [],
      qualityTypes: [], // 项目类别 质量

      isCompany: false, // 安装
      isDesign: false, // 设计管理
      isTechnology: false, // 科技管理
      isQuality: false, // 质量

      projectPost: [], // 项目人员岗位设置
      otherPost: [], //  其他人员岗位设置
      isSubmitProject: 0, //    是否能成功提交(项目领导班子人员配置) 0 不能 1能
      isSubmitOther: 0 //    是否能成功提交(其他岗位) 0 不能 1能
    }
  },
  created() {
    this.id = this.$route.query.projectId
    this.businessId = this.$route.query.projectId
    this.branchCode = this.$route.query.branchCode

    if (this.branchCode == '1') {
      this.isCompany = true
      this.isDesign = false
      this.isTechnology = false
      this.isQuality = false
    } else if (this.branchCode == '2') {
      this.isCompany = false
      this.isDesign = false
      this.isTechnology = true
      this.isQuality = false
    } else if (this.branchCode == '3') {
      this.isCompany = false
      this.isDesign = true
      this.isTechnology = false
      this.isQuality = false
    } else {
      this.isCompany = false
      this.isDesign = false
      this.isTechnology = false
      this.isQuality = true
    }

    localStorage.setItem('projectId', this.id)

    this.getDepartConfig()
    this.getDepartConfigs()

    this.getInstallationBranchId()
    this.getDesignType()
    this.getProjectTypes()
  },
  computed: {},
  methods: {
    dataSources(val) {
      this.datas = val
    },
    goBack() {
      if (this.branchCode == 1) {
        this.$router.push({ path: '/project/install' })
      } else {
        this.$router.push({ path: '/project/lists' })
      }
    },

    employeeNums(val) {
      this.employeeNum = val
    },

    changeEmployees(val) {
      this.employees = val
    },
    getProjectTypes() {
      this.type0loading = true
      getProjectTypes().then((res) => {
        this.qualityTypes = res.data?.filter(i => i.status*1 === 1)
         this.type0loading = false
      })
    },
    handleSave(e) {
      e.preventDefault()
      this.form.validateFields((err, values) => {
        if (!err) {
          this.form.validateFields((err, values) => {
            if (!err) {
              values.projectId = localStorage.getItem('projectId')
              editBranchInfo(values).then((res) => {
                if (res.data.code == 200) {
                  this.$message.success('保存成功！')
                  this.nextSteps = '2'
                }
              })
            }
          })
        }
      })
    },
    handleEdit(record) {
      let _this = this
      _this.visible = true
      _this.employeeMultiSelect = !!record.numberLimitCode
      _this.datas = []
      _this.mdl = { ...record }
    },

    getDesignType() {
      
      getTypes({ type: 9 }).then((res) => {
        this.designTypes = res.data
      })
      getTypes({ type: 24 }).then((res) => {
        this.techonlogyTypes = res.data
      })
    },
    getInstallationBranchId() {
      let id = localStorage.getItem('projectId')
      getProjectsDel({ projectId: id }).then((res) => {
        this.dels = res.data

        this.form.setFieldsInitialValue(res.data)

        if (this.dels.innerPackageName == '是') {
          this.isContract = true
        }
        if (this.dels.projectTypeCode == 'fj') {
          this.isContractMileage = false
          this.isConstruction = true
        }
        if (this.dels.calculateTypeCode == '0') {
          this.isContractMileage = false
          this.isConstruction = true
        } else {
          this.isContractMileage = true
          this.isConstruction = false
        }
      })
    },
    getDepartConfig() {
      // 项目岗位设置
      let proId = localStorage.getItem('projectId')
      getDepartConfig({ projectId: proId, projectJobType: 1, jobType: 1 }).then((res) => {
        this.projectPost = res.data.postConfigList
      })
    },
    getDepartConfigs() {
      // 其他岗位设置
      let proId = localStorage.getItem('projectId')
      getDepartConfig({ projectId: proId, projectJobType: 0, jobType: 1 }).then((res) => {
        this.otherPost = res.data.postConfigList
      })
    },

    callback(key) {
      // tabs切换
      this.nextSteps = key
      // if(this.nextSteps == '2'){
      //   this.form.validateFields((err, values) => {
      //     if (!err) {
      //       values.projectId = localStorage.getItem("projectId")
      //       editBranchInfo(values).then(res => {
      //         if(res.data.code == 200){
      //           this.nextSteps = '2'
      //           this.$message.success("保存成功！")
      //         }
      //       }).catch(()=>{
      //         this.nextSteps = '1'
      //       })
      //     }else{
      //       this.nextSteps = '1'
      //     }
      //   })
      // }
    },
    submit() {
      // tabs切换
      let _this = this
      _this.form.validateFields((err, values) => {
        if (!err) {
          if (this.loadingState.isSubmit) return
          this.loadingState.isSubmit = true
          values.projectId = localStorage.getItem('projectId')
          if (_this.branchCode == '1') {
            editBranchInfo(values)
              .then((res) => {
                this.loadingState.isSubmit = false
                if (res.data.code == 200) {
                  _this.$message.success('提交成功！')
                  this.$router.push({ path: '/project/install' })
                }
              })
              .catch(() => {
                this.loadingState.isSubmit = false
              })
          } else {
            editCatagoryInfo(values)
              .then((res) => {
                this.loadingState.isSubmit = false
                if (res.data.code == 200) {
                  this.$message.success('提交成功！')
                  this.nextSteps = '2'
                  this.$router.push({ path: '/project/lists' })
                }
              })
              .catch(() => {
                this.loadingState.isSubmit = false
              })
          }
        } else {
          _this.nextSteps = '1'
          this.$message.warning('请完善表单')
        }
      })
    },
    handleCancel() {
      let _this = this
      _this.visible = false
      const form = _this.$refs.createModal.form
      form.resetFields() // 清理表单数据
    },
    handleOk() {
      const form = this.$refs.createModal.form
      this.confirmLoading = true
      form.validateFields((errors, values) => {
        if (!errors) {
          values.projectId = this.mdl.projectId
          values.projectJobId = this.mdl.jobId
          values.staffList = this.employees.map((e) => {
            return { employeeNum: e.employeeNum, employee: { key: e.key, label: e.label } }
          })
          // values.employeeNum = this.employeeNum
          this.datas = this.datas
          addDepartmentConfig(values)
            .then((res) => {
              this.datas = []
              this.visible = false
              this.confirmLoading = false
              this.$message.info('设置成功')
              this.getDepartConfig()
              this.getDepartConfigs()
            })
            .catch((err) => {
              this.confirmLoading = false
              // this.$error({content:err.response.data&&err.response.data.message})
            })
        } else {
          this.confirmLoading = false
        }
      })
    },

    nextStep() {
      // 下一步
      let steps = this.nextSteps
      if (steps == '1') {
        this.nextSteps = '2'
        // this.form.validateFields((err, values) => {
        //     values.projectId = this.id
        //     if(this.branchCode == '1'){
        //       editBranchInfo(values).then(res => {
        //         if(res.data.code == 200){
        //           this.$message.success("保存成功！")
        //           this.nextSteps = '2'
        //         }
        //       })
        //     }else{
        //       editCatagoryInfo(values).then(res => {
        //         if(res.data.code == 200){
        //           this.$message.success("保存成功！")
        //           this.nextSteps = '2'
        //         }
        //       })
        //     }
        // })
      }
      if (steps == '2') {
        this.nextSteps = '3'
      }
    },
    /**
     * @description: 计算专业工程暂估价总额
     * @param {void}
     * @return {void}
     */
    calcEstimateTotalAmount() {
      const contractValue = typeof this.form.contractValue === 'number' ? this.form.contractValue : 0
      const ownerContractValue = typeof this.form.ownerContractValue === 'number' ? this.form.ownerContractValue : 0
      this.form.estimateTotalAmount = (contractValue - ownerContractValue).toFixed(2)
    }
  }
}
</script>

<style lang="less" scoped>
.wrapper-row {
  padding-left: 55px;
  font-weight: bold;
  letter-spacing: 1px;
}

.requireRed {
  color: red;
}

/deep/ .ant-form-item label {
  font-size: 12px;
}

/deep/ .ant-btn {
  border-radius: 5px;
}

/deep/ .ant-input {
  /*width: 70%;*/
  border-radius: 5px;
}

/deep/ .ant-card.ant-card-bordered {
  border-radius: 5px;
}

.ant-avatar-lg {
  width: 48px;
  height: 48px;
  line-height: 48px;
}

.list-content-item {
  color: rgba(0, 0, 0, 0.45);
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
  margin-left: 40px;

  span {
    line-height: 20px;
  }

  p {
    margin-top: 4px;
    margin-bottom: 0;
    line-height: 22px;
  }
}

.title-name {
  border-left: 5px solid #1890ff;
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 20px;
  padding-left: 15px;
  height: 20px;
  line-height: 20px;
}

/deep/ .table-page-search-wrapper .ant-form-inline .ant-row .ant-col.ant-col-sm-24.ant-col-md-12 {
  padding-left: 80px;
}
</style>

